{% extends "base.html" %}

{% block title %}忘记密码{% endblock %}

{% block content %}
<div class="auth-container">
    <div class="text-center mb-4">
        <div class="auth-icon">
            <i class="fas fa-key"></i>
        </div>
        <h2>找回密码</h2>
        <p class="text-muted">请输入您的用户名、用户ID和新密码</p>
    </div>

    {% with messages = get_flashed_messages(with_categories=true) %}
        {% if messages %}
            <div class="alert-container">
                {% for category, message in messages %}
                    <div class="alert alert-{{ category }} alert-dismissible fade show" role="alert">
                        {{ message }}
                        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                    </div>
                {% endfor %}
            </div>
        {% endif %}
    {% endwith %}

    <form method="POST" action="{{ url_for('auth.forgot_password') }}">
        <div class="mb-3">
            <label for="username" class="form-label">
                <i class="fas fa-user me-2"></i>用户名
            </label>
            <input type="text" class="form-control" id="username" name="username" required
                   placeholder="请输入您的用户名">
        </div>

        <div class="mb-3">
            <label for="user_id" class="form-label">
                <i class="fas fa-id-card me-2"></i>用户ID
            </label>
            <input type="text" class="form-control" id="user_id" name="user_id" required
                   placeholder="请输入您的用户ID">
        </div>

        <div class="mb-3">
            <label for="new_password" class="form-label">
                <i class="fas fa-lock me-2"></i>新密码
            </label>
            <input type="password" class="form-control" id="new_password" name="new_password" required
                   placeholder="请输入新密码">
        </div>

        <div class="mb-3">
            <label for="confirm_password" class="form-label">
                <i class="fas fa-lock me-2"></i>确认新密码
            </label>
            <input type="password" class="form-control" id="confirm_password" name="confirm_password" required
                   placeholder="请再次输入新密码">
        </div>

        <button type="submit" class="btn btn-primary w-100">
            <i class="fas fa-sync-alt me-2"></i>重置密码
        </button>

        <div class="text-center mt-3">
            <a href="{{ url_for('auth.login') }}" class="text-decoration-none">
                <i class="fas fa-sign-in-alt me-2"></i>返回登录
            </a>
        </div>
    </form>
</div>

<style>
/* 保持原有样式不变 */
.auth-container {
    max-width: 450px;
    margin: 5rem auto;
    padding: 3rem;
    background: white;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}
</style>
{% endblock %}
